#top {
  width: 100%;
  height: 75px;
  background-color: rgb(202, 206, 195, 0.1);
  position: absolute;
  z-index: 100;
}
.LogoClass1 {
  width: 75px;
  height: 75px;
  position: absolute;
  background-color: rgb(101, 138, 138, 0);
  top: 0px;
  left: 25%;
  text-align: center;
  line-height: 2.5;
  transition-duration: 0.5s;
}
.LogoClass1:hover {
  transform: translateY(-5px);
  transform: scale(1.2);
}
body {
  margin: 0px;
}
.nav {
  position: absolute;
  top: 22px;
  left: 49.5%;
  width: 32px;
  height: 10px;
  font-size: 16px;
  color: white;
  text-decoration: none;
}
.nav.first {
  width: 6%;
  left: 57%;
}
.nav.second {
  width: 6%;
  left: 66.5%;
}
.nav.third {
  left: 76.5%;
}
.choice {
  position: relative;
  top: 50px;
  left: 57%;
  width: 4%;
  height: 2px;
  background-color:white;
}
.image {
  position: relative;
  top: 0px;
  background-color: #b3b3b3;
  width: 100%;
  height: 350px;
}
.chartBack {
  position: relative;
  top: 0px;
  width: 100%;
  /* height: 700px; */
  background-color: white;
  
}
.charts {
  position: relative;
  top: 0px;
  left: 30%;
  width: 700px;
  /* height: 700px; */
  background-color: #9dd5eb;
  background-image: linear-gradient(#c5e8fe, #81c7de);
  border-radius: 40px;
  min-height: calc(70vh - 45px);
  /* 计算页尾，使页尾始终在页面尾部 */
}
/* .chartTitle {
  position: absolute;
  top: 0px;
  left: 25px;
  font-size: 36px;
  text-align: center;
  width: 100%;
  height: 24px;
  color: rgb(155, 14, 14);
} */
.userList {
  position: relative;
  height: auto;
  top: 0px;
  left: 16%;
}
#userList {
  position: relative;
  top: 0px;
  left: 60px;
  font-size: 26px;
  color: black;
  line-height: 2;
  margin: 0px;
}
/* .frequency {
  position: absolute;
  top: 50px;
  left: 250px;
}
#frequencyList{
    font-size: 26px;
    color: white;
} */
footer {
  position: absolute;
 bottom: 0pz;
  width: 100%;
  height: 45px;
  background-color:rgb(67, 139, 246);
  text-align: center;
  font-size: 28px;
  /* z-index: 100; */
}
body {
    margin: 0;
    padding: 0;
}
.main {
    min-height: calc(100vh - 80px);
}
.box {
  position: absolute;
  top: 250px;
  left: 140px;
  width: 300px;
  height: 300px;
  border-radius: 25px;
  /* transform: rotate(45deg); */
}
.box.f{
  top: 50px;
  left: 1150px;
  /* transform: rotate(325deg); */
}
.footer {

    font-size: 20px;
    color: white;
    height: 45px;
   
    background-color: rgb(67, 139, 246);
}
.hit{
  position: relative;
  display:inline-table;
  height: 40px;
  top: 2px;
  width:3px;
  left: 50%;
  background-color: white;
}
.text{
  position: absolute;
  width: 40% ;
  left: 10%;
  font-size: 20px;
  text-align: center;
  line-height: 2;
 word-spacing: 80px;
}
.text.sss{
  position: relative;
  top: -45px;
  left: 45%;  
  width: 60%;
  color: white;
  z-index: 100;
}